import  { useState } from "react";      
import '../../css/from.css'
const Input = (props) => {
    // 日期
    const[rqi] = useState( )
    // 标题
    const[ti] = useState( )
    const [list,setuserInfo] = useState(
        {
            rqi:'',
            ti:'',
            you:''
        }
    )
    // 日期
    const date = (val) =>{
        setuserInfo(() =>{
            return {
                ...rqi,
                rqi:val.target.value
            }
        })
    }
    // 标题
    const biao = (val) =>{
        setuserInfo(() =>{
            return {
                ...list,
                ti:val.target.value
            }
        })
    }
    // 优先级
    const radio = (val) => {
        setuserInfo(() =>{
            return {
                ...list,
                you:val.target.value
            }
        })
    }
    const button = () =>{
       props.updateTodoList(list)
    }
    return (
        <div className="ipt">
            <div className="input">
                日期：<input className="inputss" value={rqi} onChange={date} type="date" />
            </div>
            <div className="input">
                标题：<input className="inputss" value={ti} onChange={biao} type="text" />
            </div>
            <div className="inputs">
                优先级： 一级:<input type="radio" value='1' name="1" onChange={radio}/>
                        二级:<input type="radio" value='2' name="1" onChange={radio}/>
                        三级:<input type="radio" value='3' name="1" onChange={radio}/>
                
            </div>
            <button className="btn" onClick={button}>添加</button>
        </div>
    )
}
export default Input